<!DOCTYPE html>
<html>
<head>

    <meta charset="utf-8">
    <base href="{{asset('')}}">
    <meta name="_token" content="{{csrf_token()}}"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> 认证用户登录</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="{{asset("/images/logo.png")}}">
    <link href="front/hAdmin/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="front/hAdmin/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="front/hAdmin/css/animate.css" rel="stylesheet">
    <link href="front/hAdmin/css/style.css?v=4.1.0" rel="stylesheet">
    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html"/>

    <![endif]-->
    <script>if (window.top !== window.self) {
            window.top.location = window.location;
        }</script>
    <style>
        .re-send-captcha {
            display: none;
        }

        .rewrite-phone {
            display: none;
            font-size: 12px;
        }
        .logo-name{
            margin-left: -10%;
        }
    </style>
</head>

<body class="gray-bg">

<div class="middle-box text-center loginscreen  animated fadeInDown">
    <div>
        <div >
            {{--<h1 >Mytee</h1>--}}
            <img class="logo-name" src="{{asset("/images/title.png")}}" title="Mytee">
        </div>
        <br/><br/>
        <h2><strong>账号登录</strong></h2>

        {{--<form class="m-t">--}}
        <div class="form-group">
            <input type="text" id="phone" class="form-control" maxlength="11" placeholder="请输入手机号码" autocomplete="off">
            <a style="float: right" class="rewrite-phone">重新输入手机号</a>
        </div>
        <div class="form-group">
            <input type="text" id="captcha" class="form-control" maxlength="4" placeholder="请输入短信验证码" autocomplete="off">
        </div>
        <button class="btn btn-info block full-width m-b send-captcha">获取短信验证码</button>
        <button class="btn block full-width m-b re-send-captcha">
            <span id="showtimes" style="color: #1c1c1c;"></span>s后可重新获取
        </button>
        <button class="btn btn-primary block full-width m-b" id="login">登 录</button>

        {{--</form>--}}
    </div>
</div>
<!-- 全局js -->
<script src="front/hAdmin/js/jquery.min.js?v=2.1.4"></script>
<script src="front/hAdmin/js/bootstrap.min.js?v=3.3.6"></script>
<script src="front/hAdmin/js/plugins/layer/layer.min.js"></script>
</body>
<script type="text/javascript">
    var _token = '{{csrf_token()}}';
    $('#login').on('click', function () {
        var phone = $("#phone").val();
        var captcha = $("#captcha").val();
        if (phone == '') {
            layer.tips('请输入手机号码', '#phone', {
                tips: [1, '#23b7e5'],
                time: 3000
            });
            $('#phone').focus();
            return false;
        }
        if (captcha == '') {
            layer.tips('请输入短信验证码', '#captcha', {
                tips: [1, '#23b7e5'],
                time: 3000
            });
            $('#phone').focus();
            return false;
        }
        if (!(/^[1][345678][0-9]{9}$/.test(phone))) {
            layer.tips('手机号码格式不正确', '#phone', {
                tips: [2, '#FF0509'],
                time: 3000
            });
            $('#phone').focus();
            return false;
        }
        $("#login").attr("disabled", "disabled");
        $.ajax({
            type: "post",
            url: "/authentication/login",
            data: {"phone": phone, "captcha": captcha, "_token": _token},
            success: function (msg) {
                if (msg.state == "M00000") {
                    layer.msg('校验成功...');
                    setTimeout("location.href = 'authentication/home';", 1000);
                }else if (msg.state == "M01001") {
                    $("#login").removeAttr("disabled");
                    layer.msg('请先获取验证码');
                }else if (msg.state == "M01002") {
                    $("#login").removeAttr("disabled");
                    layer.msg('验证码超时,请重新获取');
                }else if (msg.state == "M01003") {
                    $("#login").removeAttr("disabled");
                    layer.tips('验证码不正确,请重新输入', '#captcha', {
                        tips: [2, '#FF0509'],
                        time: 3000
                    });
                    $('#captcha').focus();
                }
            },
            error: function () {
                $("#login").removeAttr("disabled");
            }
        });
    });

    $(".send-captcha").on('click', function () {
        $(".rewrite-phone").hide();
        var phone = $("#phone").val();
        if (phone == '') {
            layer.tips('请输入手机号码', '#phone', {
                tips: [1, '#23b7e5'],
                time: 3000
            });
            $('#phone').focus();
            return false;
        }
        if (!(/^[1][345678][0-9]{9}$/.test(phone))) {
            layer.tips('手机号码格式不正确', '#phone', {
                tips: [2, '#FF0509'],
                time: 3000
            });
            $('#phone').focus();
            return false;
        }
        layer.msg('验证码发送中...');
        $(".send-captcha").attr("disabled", "disabled");
        $.ajax({
            type: "post",
            url: "/authentication/send-captcha",
            data: {"phone": phone, "_token": _token},
            success: function (msg) {
                if (msg.state == "M00000") {
                    layer.msg('验证码已发送,请查收');
                    $(".send-captcha").hide();
                    $(".re-send-captcha").show();
                    $(".re-send-captcha").attr("disabled", "disabled");
                    $(".rewrite-phone").show();
                    $("#phone").attr("disabled", "disabled");
                    showTime()
                } else if (msg.state == "M09004") {
                    layer.open({
                        skin: 'layui-layer-lan',
                        content: '验证码已发送,请查看短信'
                    });
                    $(".send-captcha").removeAttr("disabled");
                } else if (msg.state == "M09003") {
                    layer.open({
                        skin: 'layui-layer-lan',
                        content: '抱歉!您今日短信验证码已达上限,请明日再试'
                    });
                    $(".send-captcha").removeAttr("disabled");
                } else if (msg.state == "M09005") {
                    layer.open({
                        skin: 'layui-layer-lan',
                        content: '抱歉!此后台只允许认证用户登录'
                    });
                    $(".send-captcha").removeAttr("disabled");
                }
            },
            error: function () {
                $(".send-captcha").removeAttr("disabled");
            }
        });
    });

    $('.rewrite-phone').on('click', function () {
        $(".send-captcha").show();
        $(".re-send-captcha").hide();
        $("#phone").removeAttr("disabled");
    });

    //设定倒数秒数
    var t = 60;
    //显示倒数秒数
    function showTime() {
        if (t <= 1) {
            $(".send-captcha").show();
            $(".re-send-captcha").hide();
            $(".send-captcha").removeAttr("disabled");
            t = 60;
        } else {
            t--;
            //每秒执行一次,showTime()
            setTimeout("showTime()", 1000);
        }
        document.getElementById('showtimes').innerHTML = t;
    }
</script>
</html>
